<script setup lang="ts">
    import {NConfigProvider,NPopover,NButton,NAvatar} from 'naive-ui'
    import { computed, ref, watch,onMounted,onBeforeMount } from 'vue'
    import {NaiveProvider} from '@/components/common'
    import {useTheme} from '@/hooks/useTheme'
    import {useLanguage} from '@/hooks/useLanguage'
    import {useBasicLayout} from '@/hooks/useBasicLayout'
    import { useAppStore, useChatStore } from '@/store'
    import type { Theme } from '@/store/modules/app/helper'
    import { SvgIcon } from '@/components/common'
    import { indexMenu } from '@/components/common'
    import { mobileMenu } from '@/components/common'
    import { isString } from '@/utils/is'
    import { useRouter,useRoute } from 'vue-router'
    const {theme, themeOverrides} = useTheme()
    const {language} = useLanguage()
    const {isMobile} = useBasicLayout()
    const router = useRouter()
    const appStore = useAppStore()

    function getStyle() {
        if (isMobile) {
            return "position:absolute;top:110%;text-align:center;bottom:0;margin:0 auto;width:100%;color: #5c6b77"
        }
        return "position:absolute;top:100%;text-align:center;bottom:0;margin:0 auto;width:100%;color: #5c6b77"
    }


    const route = useRoute()
    let routeName = route.name;

    // 用于管理不同菜单之间的距离
    function getClassByName() {
        debugger
        if(routeName==="chat"){
            return  "{" +
                "margin-left: 100px;" +
                "height: 100%;" +
                "}"
        }else if(routeName==='aideDetail'){
            debugger
            return  "{" +
                "margin-left: 80px;" +
                "height: 100%;" +
                "}"
				}
        return  "{" +
            "margin-left: 60px;" +
            "height: 100%;" +
            "}"
    }

</script>

<template>
	<NConfigProvider
		class="h-full"
		:theme="theme"
		:theme-overrides="themeOverrides"
		:locale="language"
	>
		<NaiveProvider>

			<indexMenu/>

			<div v-if="isMobile" class="container">
				<RouterView :class="getClassByName"/>
			</div>
			<RouterView v-else/>
			<mobileMenu/>
		</NaiveProvider>
	</NConfigProvider>
</template>
<style>
	.left-div {
		height: 100%;
		width: 70px;
		float: left;
		background-color: #ddd; /* Change this to preferred color */
	}
	.main-content {
		/*margin-left: 100px;*/
		margin-left: 60px;
		height: 100%;
	}
	.container {
		height: 93%;
	  overflow: auto;
	}
</style>
<!--			暂时去掉下方备案-->
<!--<div v-if="false"-->
<!--		 style="position:absolute;top:100%;text-align:center;bottom:0;margin:0 auto;width:100%;color: #999999"-->
<!--&gt;-->
<!--	<br v-if="isMobile">-->
<!--	<br v-if="isMobile">-->
<!--	<img src='http://cdn.beiruijk.com/0be25a8d779aee40433aaca76c5f6ce.jpg'-->
<!--			 style="display: inline-block; vertical-align: middle;"/>-->
<!--	<a-->
<!--		target="_blank"-->
<!--		style="color: #999999;font-size: 14px; display: inline-block; vertical-align: middle;"-->
<!--		href="https://beian.miit.gov.cn/"-->
<!--	> &nbsp;湘ICP备2021013567号-1</a>-->
<!--	<span style="color: #999999;font-size: 14px">&nbsp; @2023 蓝猫AI工作室</span>-->
<!--</div>-->
